从零搭建你的博客网站 vuepress+vercel+github

2024-01-26 20:47| 来源: 网络整理| 查看: 265

搭建静态博客网站

常见的静态网站的模板有很多wordpress,vuepress等等，这里使用的是vuepress模板

1.下载修改vuepress模板

vuepress-theme-reco官网

我这里是在github上下载的demo模板，直接在它的基础进行修改在这里插入图片描述

下载地址

下载好之后解压，如果你想要本地运行那么你需要nodejs,我这里使用的是node14.6.0

然后输入以下命令

//安装依赖包 npm install / yarn install //运行项目 npm run dev

包管理工具有npm,cnpm,yarn,自带的是npm

修改的配置

需要修改的地方只有几个 README.md可以修改一些主页的属性 .vuepress下的config.js 可以修改一些全局配置在我们就可以写博客在blogs下 docs下的需要在config.js下配置路径在这里插入图片描述 config.js中的侧边栏参考vuepress

2.上传修改好的模板上传到github

github创建好仓库之后用git上传就可以了

//首先添加公钥 git init //初始化本地仓库 git add . //添加文件到工作区 git commit -m '' //提交到本地仓库 git remote add origin 'url' //拉一下合并本地分支 git pull origin master --allow-unrelated-histories //完成时会进入一个文件，直接:wq保存退出即可需要合并一下仓库 //之后才可以上传push git push origin master //强制覆盖远程仓库 git push -f --set-upstream origin master:master 3.部署构建代码到vercel

vercel官网直接用GitHub账号登录

vercel 创建新项目在这里插入图片描述选择需要导入的库仓库名配置默认即可